<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>main</title>
    <link rel="stylesheet" th:href="@{css/admin.css}">
</head>
<body>

<div class="btnArea">
    <button id="addManagerBtn" class="blueBtn">添加管理员</button>
</div>
<div class="managerList">
    <table class="bordered">
        <thead>
        <tr>
            <th>管理员Id</th>
            <th>用户名</th>
            <th>管理员身份</th>
            <th>真实姓名</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody><!--这里的内容动态加载  -->
        <tr th:each="admin:${admins}">
            <td class="adminId"  th:text="${admin.adminId}"></td>
            <td class="username" th:text="${admin.username}"></td>
            <td class="roleId" th:text="${admin.roleId}"></td>
            <td class="realname" th:text="${admin.realname}"></td>
            <td><button class="mod" th:data-id="${admin.adminId}">修改</button>
                <button class="del" th:data-id="${admin.adminId}">删除</button>
            </td>
        </tr>
        </tbody>
    </table>
</div>


<!--添加管理员页面-->
<div class="addForm">
    <form class="addd">
        <div>
            <input type="text" name="username" class="username2" placeholder="用户名">
        </div>
        <div>
            <input type="text" name="mobile" class="mobile2" placeholder="电话号">
        </div>
        <div>
            <input type="text" name="realname" class="realname2" placeholder="真实姓名">
        </div>
        <div>
            <input type="text" name="roleId" class="roleId2" placeholder="角色id">
        </div>
        <div>
            <button type="submit" class="btnadd">确定</button>
            <button type="button" class="retbtn">返回</button>
        </div>
    </form>
</div>
<div class="modifyAdmin">
</div>

<div class="blackCover"></div>

<script type="text/javascript" th:src="@{jquery-3.5.0.min.js}"></script>
<script type="text/javascript" th:src="@{js/admin.js}"></script>

</body>
</html>